<template>
  <view class="commonLim-list">
    <view class="commonLim-listView-item" style="margin-bottom: 0">
      <view class="commonLim-listView-item-content">
        <view class="half width100">
          <label>领料编号:</label>
          <text>{{ pickOrder.pickNo }}</text>
        </view>
        <view class="half">
          <label>领料类型:</label>
          <text>{{ pickOrder.pickTypeName }}</text>
        </view>
        <view class="half">
          <label>领料人:</label>
          <text>{{ pickOrder.pickerName }}</text>
        </view>
        <!-- <view class="half width100">
          <label>备注:</label>
          <text>{{ pickOrder.remark }}</text>
        </view> -->
      </view>
    </view>
    <view class="information">
      <view> 领取要求 </view>
    </view>
    <view class="commonLim-listView-item" style="margin-bottom: 0">
      <view class="commonLim-listView-item-content">
        <view class="half width100">
          <label>材质:</label>
          <text>{{ requirements.materialTypeName }}</text>
        </view>
        <view class="half width100">
          <label>规格型号:</label>
          <text>{{ requirements.specificationName }}</text>
        </view>
        <view class="half" v-if="chengpin">
          <label>物料编码:</label>
          <text>{{ requirements.materialCode }}</text>
        </view>
        <view class="half">
          <label>炉号:</label>
          <text>{{ requirements.heatNo }}</text>
        </view>
        <view class="half">
          <label>领取量:</label>
          <text>{{ requirements.quantity }}</text>
        </view>
        <!-- <view class="half width100">
          <label>备注:</label>
          <text>{{ pickOrder.remark }}</text>
        </view> -->
      </view>
    </view>
    <view class="information">
      <view> 领料明细 </view>
      <view class="flexClass" v-if="isshengchanlingliao">
        <image
          src="../../static/tabs/qr.png"
          @click="scanhandleCode"
          class="qrClass"
        />
        <image
          src="../../static/tabs/icon_tianjia.png"
          @click="onAdd"
          class="qrClass"
        />
      </view>
    </view>
    <view class="commonLim-listView">
      <view v-show="pickDetails.length">
        <view v-for="item in pickDetails" :key="item.id" class="listsssClass">
          <view v-show="chengpin" class="wrapBox">
            <view class="smallBox pd20">
              <label>物料编码:</label>
              <text>{{ item.materialCode }}</text>
            </view>
            <view class="smallBox">
              <label>物料名称:</label>
              <text>{{ item.materialName }}</text>
            </view>
            <view class="smallBox">
              <label>材质:</label>
              <text>{{ item.materialTypeName }}</text>
            </view>
            <view class="smallBox">
              <label>规格型号:</label>
              <text>{{ item.specificationName }}</text>
            </view>
            <view class="smallBox">
              <label>炉号:</label>
              <text>{{ item.heatNo }}</text>
            </view>
            <view class="smallBox">
              <label>出库量:</label>
              <text>{{ item.quantity }}</text>
            </view>
            <view class="smallBox">
              <label>编号:</label>
              <text>{{ item.serialNo }}</text>
            </view>
            <view class="smallBox">
              <label>客户简称:</label>
              <text>{{ item.customerAbbr }}</text>
            </view>
            <view class="smallBox">
              <label>备注:</label>
              <text>{{ item.remark }}</text>
            </view>
          </view>
          <view v-show="!chengpin" class="wrapBox">
            <view class="smallBox">
              <text>原料编码:</text>
              <text>{{ item.rawMaterialCode }}</text>
            </view>
            <view class="smallBox">
              <text>原料名称:</text>
              <text>{{ item.rawMaterialName }}</text>
            </view>
            <view class="smallBox">
              <text>材质:</text>
              <text>{{ item.materialTypeName }}</text>
            </view>
            <view class="smallBox">
              <text>规格型号:</text>
              <text>{{ item.specificationName }}</text>
            </view>
            <view class="smallBox">
              <text>炉号:</text>
              <text>{{ item.heatNo }}</text>
            </view>
            <view class="smallBox">
              <text>出库量:</text>
              <text>{{ item.quantity }}</text>
            </view>
            <view class="smallBox">
              <text>卷号:</text>
              <text>{{ item.coilNo }}</text>
            </view>
            <view class="smallBox">
              <text>厂商:</text>
              <text>{{ item.supplierName }}</text>
            </view>
            <view class="smallBox">
              <text>备注:</text>
              <text>{{ item.remark }}</text>
            </view>
          </view>
          <view class="yichu" v-if="isshengchanlingliao">
            <up-button
              type="error"
              text="移除"
              size="small"
              @click="handledelete(item)"
            ></up-button>
          </view>
        </view>
      </view>
      <up-empty mode="data" v-show="pickDetails.length == 0"> </up-empty>
    </view>
    <view
      class="dengjiClass"
      v-if="!['领料查询', '领料下单'].includes(activityName)"
    >
      <button @click="onSubmit" class="commonClass" v-if="isshengchanlingliao">
        提交
      </button>
      <button
        @click="handletijiao"
        class="commonClass first"
        v-if="['领料确认', '出库确认'].includes(activityName)"
      >
        确认
      </button>
      <CancelMsg
        :fromThatPage="activityName"
        :currentObj="memberStore.currentmaterialtable"
        @fatherFn="fatherFn"
        v-if="['领料确认', '出库确认'].includes(activityName)"
        style="flex: 1"
      />
    </view>
  </view>
</template>

<script setup>
import {
  getrequirement,
  addOrEditessaveRequisition,
  materialsRequisitionDelete,
  saomarequest,
  pickRequirementsworkflowsubmit,
} from "./api.js";
import { onCan } from "@/utils/index.js";
import { useMemberStore } from "@/stores/modules/member";
const memberStore = useMemberStore();
const deprops = defineProps(["id", "workflowWorkItemId", "activityName"]);
const pickOrder = ref({});
const requirements = ref({});
const pickDetails = ref([]);
const chengpin = computed(() => pickOrder.value.pickType == 1);
const isshengchanlingliao = computed(() => deprops.activityName == "生产领料");
const handledelete = async (item) => {
  if (item.id) {
    await materialsRequisitionDelete({
      ids: [item.id],
      deleteReason: "库存调整",
    });
    uni.showToast({ icon: "success", title: "删除成功" });
  }
  pickDetails.value = pickDetails.value.filter((i) => i != item);
};
const onAdd = () => {
  memberStore.lingliaoyaoqiu = pickDetails.value;
  uni.navigateTo({
    url: `/pages/RawMaterialsAndFinishedProducts/RawMaterialsAndFinishedProducts?pickType=${pickOrder.value.pickType}&materialCode=${requirements.value.materialCode}`,
  });
};
const checkSampleInfo = async (result) => {
  const res = await saomarequest(result);
  if (res) {
    const item = res[0];
    if (item) {
      const obj = {
        pickOrderId: pickOrder.value.id,
        pickOrderRequirementId: requirements.value.id,
        materialTypeId: item.materialTypeId,
        materialTypeName: item.materialTypeName,
        specificationId: item.specificationId,
        specificationName: item.specificationName,
        heatNo: item.heatNo,
        unit: item.unit,
        remark: item.remark,
      };
      if (chengpin.value) {
        obj.materialId = item.id;
        obj.materialCode = item.materialCode;
        obj.materialName = item.materialName;
        obj.customerCode = item.customerCode;
        obj.quantity = item.totalQuantity;
        obj.serialNo = item.serialNo;
        obj.customerAbbr = item.customerName;
      } else {
        obj.rawMaterialId = item.id;
        obj.rawMaterialCode = item.rawMaterialCode;
        obj.rawMaterialName = item.rawMaterialName;
        obj.supplierName = item.supplierName;
        obj.quantity = item.stockQuantity;
        obj.coilNo = item.coilNo;
      }
      pickDetails.value.push(obj);
    }
  }
};
const scanhandleCode = () => {
  onCan(checkSampleInfo);
};

const onSubmit = async () => {
  if (!pickDetails.value.length) {
    return uni.showToast({
      icon: "none",
      title: "请添加领料明细数据",
    });
  }
  pickDetails.value.forEach((item) => {
    item.createBy = memberStore.userId;
    item.orderById = memberStore.userId;
    item.orderByName = memberStore.userName;
  });
  try {
    uni.showLoading({
      title: "加载中",
    });
    await addOrEditessaveRequisition(deprops.id, {
      details: pickDetails.value,
      requirementId: deprops.id,
      suggestion: "同意",
      workflowWorkItemId: deprops.workflowWorkItemId,
    });
    uni.showToast({ icon: "success", title: "操作成功" });
    uni.navigateBack({ delta: 1 });
  } finally {
    uni.hideLoading();
  }
};

const handletijiao = async () => {
  console.log(11112333);
  try {
    uni.showLoading({
      title: "加载中",
    });
    await pickRequirementsworkflowsubmit(deprops.id, {
      requirementId: deprops.id,
      suggestion: "同意",
      workflowWorkItemId: deprops.workflowWorkItemId,
    });
    uni.showToast({ icon: "success", title: "提交成功" });
    uni.navigateBack({ delta: 1 });
  } finally {
    uni.hideLoading();
  }
};
const fatherFn = () => {
  uni.navigateBack({ delta: 1 });
};

onLoad(async () => {
  uni.setNavigationBarTitle({
    title: `${deprops.activityName}详情`,
  });
  memberStore.stateTable.rows = [];
  await Promise.all([memberStore.apiDictfnDetail("pick_type")]);
  try {
    const res = await getrequirement(deprops.id);
    if (res) {
      pickOrder.value = res.pickOrder || {};
      const obj = memberStore.pickTypeLists.find(
        (item) => item.value == pickOrder.value.pickType
      );
      pickOrder.value.pickTypeName = obj ? obj.label : "";
      if (Array.isArray(res.requirements) && res.requirements.length) {
        requirements.value = res.requirements[0];
      } else {
        requirements.value = {};
      }
      pickDetails.value = res.pickDetails || [];
    }
  } catch (err) {
    pickOrder.value = {};
    requirements.value = {};
    pickDetails.value = [];
  }
});
onShow(() => {
  memberStore.stateTable.rows.forEach((item) => {
    const objcurrent = pickDetails.value.find(
      (list) => (list.materialId || list.rawMaterialId) == item.id
    );
    if (!objcurrent) {
      const obj = {
        pickOrderId: pickOrder.value.id,
        pickOrderRequirementId: requirements.value.id,
        materialTypeId: item.materialTypeId,
        materialTypeName: item.materialTypeName,
        specificationId: item.specificationId,
        specificationName: item.specificationName,
        heatNo: item.heatNo,
        unit: item.unit,
        remark: item.remark,
      };
      if (chengpin.value) {
        obj.materialId = item.id;
        obj.materialCode = item.materialCode;
        obj.materialName = item.materialName;
        obj.customerCode = item.customerCode;
        obj.quantity = item.totalQuantity;
        obj.serialNo = item.serialNo;
        obj.customerAbbr = item.customerName;
      } else {
        obj.rawMaterialId = item.id;
        obj.rawMaterialCode = item.rawMaterialCode;
        obj.rawMaterialName = item.rawMaterialName;
        obj.supplierName = item.supplierName;
        obj.quantity = item.stockQuantity;
        obj.coilNo = item.coilNo;
      }
      pickDetails.value.push(obj);
    }
  });
});
</script>

<style lang="scss" scoped>
.information {
  margin: 20rpx 0;
  padding: 0 30rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.flexClass > image {
  margin-left: 40rpx;
}

.commonLim-listView-item:nth-of-type(1) {
  margin-top: 0 !important;
}
.pd20 {
  padding-top: 20rpx;
}
</style>